mychart = echarts.init(document.getElementById("chartShow"))

//------------------------折线图测试数据--------------------
//var xdata = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
//data = [150, 230, 224, 218, 135, 147, 260]
//------------绘制折线图--------------------
function lineOption(xdata, data) {
    option = {
        grid: {
             width: '50%'
        },
        xAxis: {
            type: 'category',
            data: xdata
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data: data,
                type: 'line'
            }
        ]
    };
    return option;
}

//------------------------散点图测试数据--------------------
data = [[10.0, 8.04], [8.07, 6.95], [13.0, 7.58], [9.05, 8.81], [11.0, 8.33], [14.0, 7.66], [13.4, 6.81]]
//----------------绘制散点图----------------
function ScatterOption(data) {
    option = {
         grid: {
             width: '50%'
        },
        xAxis: {},
        yAxis: {},
        series: [
            {
                symbolSize: 20,
                data: data,
                type: 'scatter'
            }
        ]
    };
    return option
}

//------------------------柱状图测试数据--------------------
//xdata = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
//data = [120, 200, 150, 80, 70, 110, 130]
//------------------------柱状图绘制--------------------
function BarOption(xdata,data) {
    option = {
        grid: {
             width: '50%'
        },
        xAxis: {
            type: 'category',
            data: xdata
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data: data,
                type: 'bar'
            }
        ]
    };
    return option;
}


// 生成表格
function createTable(array) {

    var table = '<table>',
        allRows = array;

    for (var singleRow = 0; singleRow < allRows.length; singleRow++) {

        if (singleRow === 0) {

            table += '<thead>';

            table += '<tr>';

        } else {

            table += '<tr>';
        }

        var rowCells = allRows[singleRow];

        for (var rowCell = 0; rowCell < rowCells.length; rowCell++) {

            if (singleRow === 0) {

                table += '<th>';

                table += rowCells[rowCell];

                table += '</th>';

            } else {

                table += '<td>';

                table += rowCells[rowCell];

                table += '</td>';

            }
        }
        if (singleRow === 0) {

            table += '</tr>';

            table += '</thead>';

            table += '<tbody>';

        } else {

            table += '</tr>';
        }
    }

    table += '</tbody>';

    table += '</table>';

    document.getElementById('tableshow').innerHTML = table;

}

///-----------------------------------------------
var dataset = [[${result}]]; <!--接收值-->
alert(dataset);  <!--测试是否接收到-->


var pro = document.getElementById('chartlist').getElementsByTagName("li")

pro[0].onclick = function () {
    data = [
        [10.0, 8.04], [8.07, 6.95], [13.0, 7.58], [9.05, 8.81], [11.0, 8.33], [14.0, 7.66], [13.4, 6.81]
    ]
    mychart.setOption(ScatterOption(data))
    pro[0].className='active'
    pro[1].className='none'
    pro[2].className='none'
}

pro[1].onclick = function () {
    xdata = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    data = [150, 230, 224, 218, 135, 147, 260]
    mychart.setOption(lineOption(xdata,data))
    pro[0].className='none'
    pro[1].className='active'
    pro[2].className='none'
}

pro[2].onclick = function () {
    xdata = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    data = [120, 200, 150, 80, 70, 110, 130]
    mychart.setOption(BarOption(xdata,data))
    pro[0].className='none'
    pro[1].className='none'
    pro[2].className='active'
}

var mytable = document.getElementById("tableshow")
